import axios from "axios";
import { useState, useReducer } from "react";



function App() {

    // const [状态名称, 修改的触发方法] = useReducer(修改函数reducer,初始值)
    const [state, dis] = useReducer((state, action) => {
        switch (action.type) {
            case 'changeProList':
                return { ...state, proList: action.payload }
            case 'changeBannerList':
                return { ...state, bannerList: action.payload }
            default:
                return state
        }
    }, { proList: [], bannerList: [] })


    function getList() {
        axios.get('http://121.89.205.189:3000/api/pro/list').then(res => {
            console.log(res);
            dis({
                type: 'changeProList',
                payload: res.data.data
            })
        })

        axios.get('http://121.89.205.189:3000/api/banner/list').then(res => {
            console.log(res);
            dis({
                type: 'changeBannerList',
                payload: res.data.data
            })
        })
    }

    return <div>
        <button onClick={() => getList()}>获取数据</button>
        {state.proList[0] && state.proList[0].proname}

        <img src={state.bannerList[0] && state.bannerList[0].img} alt="" />

    </div>
}


export default App